<template>
  <a-layout class="logincontent">
    
      <a-form
        class="loginform"
        :model="manager"
        :label-col="labelCol"
        :wrapper-col="wrapperCol"
      >
        <a-typography-title style="text-align:center">登录</a-typography-title>
        <a-form-item label="账号" :wrapper-col="{ span: 15, offset: 4 }">
          <a-input v-model:value="value"/>
        </a-form-item>

        <a-form-item label="密码" :wrapper-col="{ span: 15, offset: 4 }">
          <a-input-password @keyup.enter="mlogin"/>
        </a-form-item>

        <a-form-item :wrapper-col="{ span: 15, offset: 8 }">
          <a-row type="flex" justify="space-between">
            <a-button type="primary" @click="login">登录</a-button>
            <a-button type="primary" @click="register">注册</a-button>
          </a-row>
        </a-form-item>
      </a-form>

  </a-layout>
</template>
<script setup>
import { reactive } from "vue";
import { post, setLocalToken, tip } from "@/common";

import { useRouter } from "vue-router";
const router = useRouter(); //获取用户路由

const login = () => {
  router.push({ path: "/home" });
};

const register = () => {
  router.push({ path: "/register" });
};

//一行24列
const labelCol = {
  span: 4,
};
const wrapperCol = {
  span: 10,
};
</script>

<style>
.logincontent {
  display: flex;
  flex-direction: column;
  background-size:100% 100% ; 
  background-attachment: fixed;

  width: 100%;
  height: 100%;
  min-width: 900px;
  min-height: 1000px;

  justify-content: center;
  align-items: center;
}
.loginform {
  background-color: #fff;
  min-width: 600px;
  box-shadow: rgba(0, 0, 0, 0.1) 0px 15px 30px;
  padding: 30px 20px;
}
</style>